<template>
	<view>
		<template v-if="searchList.length < 1">
			<!-- 搜索历史 -->
			<view class="py-2 font-md mx-2">搜索历史</view>
			<!-- 历史列表 -->
			<view class="flex flex-wrap">
				<view class="border rounded font mx-2 my-1 px-2 text-light-black" v-for="(item, index) in historyList"
					:key="index" hover-class="bg-light" @click="clickSearchHistory(item)">
					{{item}}
				</view>
			</view>
		</template>
		<template v-else>
			<!-- 搜索的数据列表 -->
			<block v-for="(item, index) in searchList" :key="index">
				<!-- 列表样式 -->
				<common-list :item="item" :index="index"></common-list>
				<!-- 全局分隔线 -->
				<divider></divider>
			</block>
		</template>
	</view>
</template>

<script>
	const demo = [{
		username: '昵称',
		userpic: '/static/default.jpg',
		newstime: "2024-03-19 下午 05:00",
		isFollow: false, //是否关注
		title: '我是标题',
		titlepic: '/static/demo/datapic/11.jpg',
		support: {
			type: 'support',
			support_count: 1,
			unsupport_count: 2,
		},
		comment_count: 2,
		share_num: 2

	}]
	import commonList from '@/components/common/common-list.vue';
	export default {
		components: {
			commonList
		},
		data() {
			return {
				searchList: [],
				searchText: '', //搜索框的内容
				historyList: ['uni-app零基础入门', 'java权威指南', 'html5', 'css3', '第一个uniapp羡慕社区交友', 'vue2', 'vue3入门'],
				type: 'post'
			}
		},
		// 监听导航输入
		onNavigationBarSearchInputChanged(e) {
			this.searchText = e.text
		},
		// 监听点击导航搜索按钮
		onNavigationBarButtonTap(e) {
			console.log(e)
			if (e.index === 0) {
				// 加载列表数据
				this.searchEvent()
			}

		},
		onReady() {
			let pageTitle = ''
			switch (this.type) {
				case 'post':
					pageTitle = "搜索帖子"
					break;
				case 'topic':
					pageTitle = "搜索话题"
					break;
				case 'user':
					pageTitle = "搜索用户"
					break;
			}
			// 修改搜索占位
			
			// let currentwebview = this.$mp.page.$getAppWebview();
			// let tn = currentwebview.getStyle().titleNView;
			// tn.searchInput.placeholder = pageTitle
			// currentwebview.setStyle({
			// 	titleNView: tn
			// })
			 var searchInputDom = document.querySelector(".uni-input-input[type=search]");    
			 console.log(searchInputDom)
				var evt = new UIEvent('input', {    
					bubbles: true,    
					cancelable: false    
				});    
				searchInputDom.value = pageTitle;   
				searchInputDom.dispatchEvent(evt);   
		},
		onLoad(e) {
			this.type = e.type
		},
		methods: {
			//点击历史条件进行搜索
			clickSearchHistory(text) {
				this.searchText = text
				this.searchEvent()
			},
			//搜索事件
			searchEvent() {
				// 隐藏软键盘
				uni.hideKeyboard()
				// 显示showLoading
				uni.showLoading({
					title: '加载中',
					mask: false
				});
				// 加载数据
				setTimeout(() => {
					this.searchList = demo
					// 隐藏loading
					uni.hideLoading()
				}, 3000)
			}
		}
	}
</script>

<style>

</style>